<template>
    <view>
        <view class="box">
            <view class="list">
                <view class="one">
                    <image :src="baseImgUrl+orData.meal.imagePath.split(',')[0]" style="
                   margin:25rpx 0 0 10rpx;width: 193rpx;
                    height: 150rpx;"></image>
                </view>
                <view class="two" style="margin-left:20rpx;">
                    <view class="center1">
                       {{orData.meal.setMealName}}
                    </view>
                    <view class="center2">
                        {{orData.meal.packageDescription}}
						
                    </view>
                </view>
                <view class="three">
                    <view class="right2">
                        <view class="text">x1</view>
                    </view>
                    <view class="right1">¥ {{orData.money}}</view>
                </view>
            </view>
            <view class="testItemInfo" >
                <view class="float1" >
                    <block>
                        <view class="left" >
                           付款方式   
                        </view>
                    </block>
                  
                   
                    <block>
                    <view class="right" >
                        {{orData.paymentType==0 ? '微信' : ''}}
                    </view>
                    </block>
                    
                </view>
                <view class="float" >
                    <block>
                        <view class="left" style="margin-top:18rpx;">
                         订单编号
                        </view>
                    </block>
                  
                   
                    <block>
                    <view class="right" >
                        {{orData.orderNo}}
                    </view>
                    </block>
                    
                </view>
				<view class="float" >
				    <block>
				        <view class="left" style="margin-top:18rpx;">
				           下单时间
				        </view>
				    </block>
				  
				   
				    <block>
				    <view class="right" >
				        {{orData.paymentTime}}
				    </view>
				    </block>
				    
				</view>
				<view class="float" >
				    <block>
				        <view class="left" style="margin-top:18rpx;">
				           开始时间
				        </view>
				    </block>
				  
				   
				    <block>
				    <view class="right" >
				        {{orData.date+' '+orData.startTime}} 
				    </view>
				    </block>
				    
				</view>
				<view class="float" >
				    <block>
				        <view class="left" style="margin-top:18rpx;">
				           截止时间
				        </view>
				    </block>
				  
				   
				    <block>
				    <view class="right" >
				      {{orData.date+' '+orData.endTime}} 
				    </view>
				    </block>
				    
				</view>
            </view>
        </view>
    </view>
</template>

<script>
	import {baseImgUrl} from "../../config.js"
    export default {
        data() {
            return {
				baseImgUrl,
                personInfoList:[
                    {
                        name:'付款方式',
                        info:'支付宝'
                    },
                    {
                        name:'订单编号',
                        info:'5874120011444'
                    },
                    {
                        name:'下单时间',
                        info:'2025/04/03 19:22:01'
                    },
                    {
                        name:'开始时间',
                        info:'2025/04/13 19:24:01'
                    },
                    {
                        name:'截止时间',
                        info:'2025/05/13 19:24:01'
                    },
                ],
				orData:{}
            }
        },
		mounted(){
			
		},
        methods: {

        },
		onLoad(opstions){
			  console.log(opstions)
			   const data =  JSON.parse(decodeURIComponent(opstions.data));
			   this.orData = data
			   console.log( this.orData)
		}
		
    }
</script>

<style lang="scss">
    .box {
        width: 750rpx;
        height: 100vh;
        background: #F7F8FA;
        // background: #F7F8FA;
        // background: #FFFFFF;
    }

    .list {
        display: flex;
        margin: 32rpx 32rpx 0;
        // border: 1rpx solid black;
        width: 686rpx;
        height: 190rpx;
        // background: #FFFFFF;
        background: #F8FCFF;
        border-radius: 16rpx 16rpx 16rpx 16rpx;
    }

    .onge {
        width: 193rpx;
        height: 150rpx;
        background: #F6F6F6;
        border-radius: 12rpx 12rpx 12rpx 12rpx;

        image {
            width: 193rpx;
            height: 150rpx;
        }
    }

    .center1 {
        margin-top: 24rpx;
       
        font-family: PingFang SC, PingFang SC;
        font-weight: 500;
        font-size: 28rpx;
        color: #333333;
    
        font-style: normal;
        text-transform: none;
    }

    .center2 {
        margin-top: 10rpx;
        width: 323rpx;
     
        font-family: PingFang SC, PingFang SC;
        font-weight: 400;
        font-size: 24rpx;
        color: #777777;
        text-align: left;
        font-style: normal;
        text-transform: none;
    }

    .right1 {
        margin: 56rpx 0rpx 0 0;
        width: 110rpx;
        height: 36rpx;
        font-family: Douyin Sans, Douyin Sans;
        font-weight: bold;
        font-size: 30rpx;
        color: #EB5432;
        text-align: center;
        font-style: normal;
        text-transform: none;
    }

    // .right2{
    //     margin:42rpx 0 0 48rpx;
    //     width: 92rpx;
    //     height: 52rpx;
    //     background: #159DFF;
    //     border-radius: 74rpx 74rpx 74rpx 74rpx;
    //     display: flex;
    //     align-items: center;
    //     justify-content: center;
    // }
    .text {
        margin: 20rpx 0 0 82rpx;
        width: 28rpx;
        height: 34rpx;
        font-family: PingFang SC, PingFang SC;
        font-weight: 400;
        font-size: 24rpx;
        color: #333333;
        text-align: left;
        font-style: normal;
        text-transform: none;
    }

    .testItemInfo {
        margin: 40rpx 32rpx 0 32rpx;
        // border: 1rpx solid black;
        width: 686rpx;
        // height: 370rpx;
        background: #F8FCFF;
        border-radius: 24rpx 24rpx 24rpx 24rpx;
		padding: 18rpx;
    }
    
    .float {
        display: flex;
        justify-content: space-between;
		align-items: center;
        margin:30rpx 0 0rpx 0rpx;
        // padding: 20rpx 0 32rpx 18rpx;
    }
	
	.float1 {
	    display: flex;
	    justify-content: space-between;
		align-items: center;
	    // padding: 20rpx 0 32rpx 18rpx;
	}
	
    .right{
        // margin-left:260rpx;
        margin-right: 10rpx;
    }
    
    // .float view:nth-child(1){margin-top:-22rpx;}
    
    
    // .float view:nth-child(3){margin-left:22rpx;}
</style>